<template>
  <div class="g-container">
    <div class='hd flex'>
        <div class='hd-item'>
            <div></div>
            <p>待接洽</p>
        </div>
        <div class='hd-item'>
            <div></div>
            <p>进行中</p>
        </div>
        <div class='hd-item'>
            <div></div>
            <p>已结束</p>
        </div>
    </div>

    <div class='mn'>
        <div class='f-oh f-mbt10'>
            <span class='mn-item-tab'>{{caseInfo.tab}}</span>
            <span to='/userCenter/caseDetail?id=1' class='mn-item-title'>{{caseInfo.title}}</span>
        </div>
        <div class='mn-item-desc'>{{caseInfo.desc}}</div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'CaseDetail',
  data () {
    return {
      caseInfo: {
        id: 1,
        tab: '劳动纠纷',
        title: '工资没拿到如何才能拿到？—— 编号1370',
        desc: '需求描述：您好： 我父亲承包了我们乡政府的路面工程， 2016.12.8号这一天， 修路过程中正好经过3名农夫门口，三名农夫请求我父亲帮忙修一下， 但是我父亲没有同意当时帮忙。当天下午发生了一起事故， 其中一名开拖拉机的人员在倒车的过程中将另外一名施工人员撞死， 肇事者和我父亲之间没有劳务合同关系， 当时开庭时， 开车的人已经有口供， 此人不是我父亲叫来帮忙， 我父亲也没有叫开车的人过来。',
        num: 1370,
        lawyer: '卓鹏',
        lawpeyPhone: 15858581578
      }
    }
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.hd{
    border: 1px solid #f0f0f0;
    margin: 10px 0;
    box-sizing: border-box;
}
.hd-item{
    width: 400px;
}

.mn{
    border: 1px solid #f0f0f0;
    box-sizing: border-box;
    margin-bottom: 10px;
    padding: 10px;
}
.mn-item{
    overflow: hidden;
}
.mn-item-title{
    line-height: 32px;
}
.mn-item-tab{
    line-height: 32px;
    display: inline-block;
    border: 1px solid #33CC99;
    border-radius: 4px;
    padding: 0 10px;
    color: #33CC99;
    margin-right: 10px;
}
.mn-item-staus{
    line-height: 32px;
    text-align: justify;
}
.mn-item-desc{
    line-height: 1.8;
}
.mn-item-left{
    width: 960px;
}
.mn-item-right{
    width: 160px;
}
.check-lawyer-btn{
    line-height: 32px;
    display: inline-block;
    background-color: #666;
    padding: 0 20px;
    color: #fff;
    border-radius: 4px;
}
</style>
